const path = require("path");
const HtmlWebpackPlugin = require('html-webpack-plugin');
const {DefinePlugin} = require('webpack');
const VueLoaderPlugin = require('vue-loader/lib/plugin');
module.exports = {
    entry: "./src/main.js",
    output: {
        filename: 'js/[name].[contenthash:6].js',
        path: path.resolve(__dirname, 'dist')
    },
    module: {
        rules: [
            {
                test: /\.js$/,
                use: ['babel-loader'],
                exclude:/node_modules/
            },
            {
                test: /\.less$/,
                use: ['style-loader',{
                    loader: 'css-loader',
                    options: {
                        importLoaders: 1,

                    }
                },'postcss-loader', {
                    loader: 'less-loader',
                    options: {
                        sourceMap: false,
                    },
                },]
            }, {
                test: /\.css$/,
                use: ['style-loader', {
                    loader: 'css-loader',
                    options: {
                        importLoaders: 1,

                    }
                },  'postcss-loader',]
            },
            {
                test: /\.vue$/,
                use: ['vue-loader']
            },
            {
                test: /\.(png||gif||svg||jpe?g)$/,
                type: 'asset',
                generator: {
                    filename: "img/[name].[hash:4][ext]"
                },
                parser: {
                    dataUrlCondition: {
                        maxSize: 30 * 1024
                    }
                }
            }
        ]
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: "./public/index.html",
            title:'vue-hello-world'
        }),
        new DefinePlugin({
            BASE_URL: '"./"'
        }),
        new VueLoaderPlugin()
    ]
}